WoltLab Website (2008)

Website relaunch Webdesign UI/UX HTML ILLUSTRATION css Webseite woltlab

WoltLab Website
Website Re-launch (2007–2010)

Around spring 2007, Berlin-based WoltLab GmbH decided to redesign and modernise the company website, which had become noticeably outdated. In addition, the release of the new, more modern version of the Burning Board 3 forum software in July 2007 also required a matching website with new functions, as the new software was also to contain many new features that made an extended connection to the company website essential.

In the future, there would be a blog, a significantly expanded customer account with an extended download and documentation area, a ticket-support-system, a bug tracker, a plug-in store for offering free and commercial forum plug-ins and lots of other goodies for customers. In addition, the new site should finally be available in German and English.

My task was the conception of the user guidance, the design, the creation of all required web pages using XHTML, CSS and Smarty Template Script, the creation of an own icon set, illustrations, photographs, PDF manuals and marketing materials (creatives, documents) as well as the translation of all German texts into English.

My design was strongly influenced by the then widely used skeuomorphism principle. I came up with an XHTML and CSS framework with a fairly simple grid to combine the boxes almost at will. There were 10 different box-colors in 4 widths and the possibility to display the company logo on the side, as well as a number of buttons in different designs, all controlled by CSS classes. The many possible combinations allowed us to build new pages quickly and easily. Responsive or flexible design was not desired by the management at the time.

Development was rather slow, as our small team focussed on the important new forum system. As a result, the new website was launched much later than planned. The actual work continued until October 2010. The website was continuously expanded and updated over the following years until it was replaced by a new, responsive version based on Twitter's Bootstrap around 2014.

Please note: All following screenshots are taken from click prototypes I designed for the project, filled with dummy data. Some pages were not necessarily implemented exactly as they are shown here.